<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"
   	  xmlns:s = "http://jboss.org/seam/faces"
      xmlns:p="http://primefaces.org/ui">

 <f:view contentType="text/html">
    
        <h:head>
            <f:facet name="first">
                <meta http-equiv="X-UA-Compatible" content="EmulateIE8" />
                <meta content='text/html; charset=ISO-8859-1' http-equiv="Content-Type"/>
                <title>Passo 1 - Designar Funcionário</title>
            </f:facet>
            
            <style>
            	.title{
            		height: 40px;
            		margin-left: 10px;
            		padding: 8px 0 0 20px;
            		font-family: arial, sans-serif !important;
            	}
            </style>

        </h:head>
        
		<h:body>

			<h:form id="frmDesigna">
			                
			    <p:growl id="msg" showDetail="true" escape="false" />
			
			    <h2 class="title ui-widget-header ui-corner-all">Passo 1 - Designar Funcionário</h2>
			    
   				<p:fieldset legend="Funcionários da Dependência">
			    
	   			    <p:selectOneMenu value="#{vbDesignaFuncionario.funcionarioDesignadoChave}" panelStyle="width:150px"  
	                         effect="fade" var="p" style="width:160px"  filter="true" filterMatchMode="startsWith">  
	            		<f:selectItem itemLabel="Selecione..." itemValue="" />  
			            <f:selectItems value="#{vbDesignaFuncionario.funcionarios}" var="f" itemLabel="#{f.nome}" itemValue="#{f.chave}"/>  
			  
			            <p:column>  
			                <p:graphicImage value="/vendabens/images/person.png" width="40" height="50"/>  
			            </p:column>  
			  
			            <p:column>  
			                #{f.nome}
			            </p:column>  
	        		</p:selectOneMenu>

				</p:fieldset>
				
				<br />
			
				<p:fieldset legend="Funcionários da Dependência">
					<p:dataTable id="lista" value="#{vbDesignaFuncionario.funcionarios}" dynamic="true" paginator="true" rows="5" var="f" emptyMessage="Funcionário não localizado." 
	        			paginatorTemplate="{FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
		                rowsPerPageTemplate="5,10">
				
					   	<p:column style="width:50px">
					   		<p:commandButton icon="ui-icon-check" title="Designar este funcionário." update=":frmDesigna:dadosFuncionario">
					   			<f:setPropertyActionListener target="#{vbDesignaFuncionario.funcionarioDesignado}" value="#{f}" />
					   		</p:commandButton>
	        			</p:column>

						<p:column headerText="Chave" sortBy="#{f.chave}" filterBy="#{f.chave}" style="width:50px">
							#{f.chave}
						</p:column>
						
						<p:column headerText="Nome" sortBy="#{f.nome}" filterBy="#{f.nome}">
							#{f.nome}
						</p:column>
						
					</p:dataTable>		

				</p:fieldset>

				<br />
					
				<p:fieldset legend="Funcionário Designado">
					<h:panelGrid id="dadosFuncionario" columns="2" cellpadding="5" render="#{not empty vbDesignaFuncionario.funcionarioDesignado}">
						<h:outputLabel for="nome" value="Nome:"/>
						<h:outputText id="nome" value="#{vbDesignaFuncionario.funcionarioDesignado.nome}" />
						<h:outputLabel for="chave" value="Chave"/>
						<h:outputText id="chave" value="#{vbDesignaFuncionario.funcionarioDesignado.chave}" />
					</h:panelGrid>	
				</p:fieldset>

				<br />

				<p:commandButton value="Confirmar" actionListener="#{vbDesignaFuncionario.designaFuncionario()}" oncomplete="alert('Funcionário salvo!');"/>
				
			 </h:form>
  
		 </h:body>
 
</f:view>
 
</html>
                    